import {defineStore} from 'pinia'
import {ref, computed, reactive} from "vue";


export const useStaticStore=defineStore('staticStore',()=>{
//     静态参数
    let windowSize = reactive({
        clientWidth:0,
        clientHeight:0
        })

    const setWindowSize = (width,height)=>{
        windowSize.clientWidth = width;
        windowSize.clientHeight = height;
    }

    return {
        windowSize,setWindowSize
    }
})


export const useSettingStore = defineStore('settingStore', () => {
    // 桌面个性化设置
    let deskSetting = reactive({
        // 是否可拖动
        draggable:true,
        // 桌面图标大小
        iconSize: 'demo'
    })

    return {
        deskSetting,
    }
})

// 应用APP(应用=>应用右侧选项=>显示的按钮；显示数据)
export const useIndexStore = defineStore("setupStore", () => {
    // 可用应用
    let applications = reactive([])
    // 已添加到桌面的应用{"x": x轴位置, "y": y轴位置, "w": 块宽度, "h": 块高度, "i": 桌面id, static: 是否静态块，不可移动}
    let deskTopApplications = reactive([
        {"x": 0, "y": 0, "w": 2, "h": 2, "i": "1", static: false},
        {"x": 2, "y": 0, "w": 2, "h": 2, "i": "2", static: false},
        {"x": 3, "y": 0, "w": 2, "h": 2, "i": "3", static: false},
        {"x": 8, "y": 0, "w": 2, "h": 2, "i": "4", static: false},

    ])
    // 底部程序坞的应用
    let deskTopApplicationDock = reactive([])

    return {
        applications,
        deskTopApplications,
        deskTopApplicationDock,
    }
})
